<template>
	<view class="container tui-skeleton">
		<tui-navigation-bar splitLine @init="initNavigation" :scrollTop="scrollTop" backgroundColor="#fff" color="#333"
			:title="pageTitle">
			<!-- :isOpacity="false" :maxOpacity="1" -->
			<view class="tui-header" :style="{ marginTop: navBarTop + 'px' }">
				<view class="get-back dy-iconfont icon-qiehuanqizuo" @click="goBack"></view>
			</view>
		</tui-navigation-bar>
		<view class="main">
			<image class="bgImg"
				src="https://pengtou-1322587508.cos.ap-shanghai.myqcloud.com/static/images/share/h5Img.png"
				mode="widthFix"></image>
			<view class="button" @tap="goRegister('page_account/autonym/index')">
				立即入驻
			</view>
		</view>
		<survey-pop></survey-pop>
		<uv-toast ref="toast"></uv-toast>
	</view>
</template>

<script>
	import mp from "@/mixins/mp.js";
	const app = getApp();
	export default {
		mixins: [mp],
		options: {
			styleIsolation: 'shared'
		}, //解决/deep/不生效**
		components: {},
		data() {
			return {
				navBarOpacity: 0, //标题图标距离顶部距离
				scrollTop: 0.5, //页面滚动高度
				navBarTop: 0, // 导航栏content顶部m-top
				skeletonShow: true, //加载
				pageTitle: '', //标题
			};
		},
		/**
		 * 计算属性
		 */
		computed: {},
		onLoad(options) {
			setTimeout(() => {
				this.skeletonShow = false;
			}, 1000);
		},
		onShow: function() {},
		/**
		 * 下拉
		 */
		onPullDownRefresh: function() {},
		/**
		 * 触底
		 */
		onReachBottom() {},
		/**
		 * 滚动
		 */
		onPageScroll(res) {
			this.scrollTop = res.scrollTop;
		},
		methods: {
			goLogin() {
				app.doLogin()
			},
			initNavigation(e) {
				this.navBarOpacity = e.opacity;
				this.navBarTop = e.top;
			},
			// 返回上一页
			goBack: function() {
				app.beNavigateBack();
			},
			onCheckLogin() {
				if (!app.globalData.isLogin) {
					app.doLogin();
					return false;
				}
				return true;
			},
			goRegister(url) {
				// app.navigationTo(url)
				if (!this.onCheckLogin()) {
					return false;
				}
				return new Promise((resolve, reject) => {
					app._get(
						"/client/peng-register/go-register", null,
						(result) => {
							let register = result.data
							uni.setStorageSync('register', register);
							if (register.settleState == 1) {
								this.$refs.toast.show({
									type: 'default',
									message: "您已是碰头人"
								})
								setTimeout(() => {
									this.$refs.toast.hide()
								}, 1000)
							} else if (register.settleState == 2) {
								this.$refs.toast.show({
									type: 'default',
									message: "正在申请中"
								})
								setTimeout(() => {
									this.$refs.toast.hide()
								}, 1000)
							} else {
								app.navigationTo(url)
							}
						}, null, () => {
							resolve();
						}
					);
				});
			},
		},
	};
</script>
<style lang="scss" scoped>
	.container {
		min-height: 100vh;
		background: #F6F8F7;

		.tui-header {
			width: 100%;
			position: fixed;
			top: 0;
			padding: 0 42rpx;
			display: flex;
			align-items: center;
			height: 32px;
			transform: translateZ(0);
			z-index: 99999;
			box-sizing: border-box;

			.get-back {
				display: flex;
				align-items: center;
				justify-content: center;
				flex-shrink: 0;
				width: 36rpx;
				height: 36rpx;
				color: #000;
				font-size: 36rpx;
				background: rgba(255, 255, 255, 0.6);
				border-radius: 50%;
				padding: 10rpx;
			}
		}

		.main {
			box-sizing: border-box;
			position: relative;
			font-size: 0;
			.button {
				position: fixed;
				bottom: 100rpx;
				left: 50%;
				transform: translate(-50%,0);
				text-align: center;
				line-height: 106rpx;
				font-size: 32rpx;
				font-weight: 900;
				width: 362rpx;
				height: 106rpx;
				background: linear-gradient(144deg, #CCFA2F 0%, #ABF61A 55%, #A7F517 100%);
				border-radius: 53rpx;
				// border: 4rpx solid #0E0E0D;

			}
			// padding: 176rpx 0rpx 0rpx 0 ;
			.bgImg {
				width: 750rpx;
			}
		}
	}
</style>